@font-face {
  font-family: 'iconfont';  /* project id 1902028 */
  src: url('//at.alicdn.com/t/font_1902028_flaxqrcvjvd.eot');
  src: url('//at.alicdn.com/t/font_1902028_flaxqrcvjvd.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_1902028_flaxqrcvjvd.woff2') format('woff2'),
  url('//at.alicdn.com/t/font_1902028_flaxqrcvjvd.woff') format('woff'),
  url('//at.alicdn.com/t/font_1902028_flaxqrcvjvd.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_1902028_flaxqrcvjvd.svg#iconfont') format('svg');
}
*{  box-sizing: border-box;}
.newEmailTop{padding: 10px 0;border-bottom: 1px #dedede dotted;}
.newEmailTop .topL{float: left;    width: calc(100% - 160px);}
.newEmailTop .topR{float: right;width: 100px;position: relative;}
.newEmailTop .topR i{font-size: 35px;color: #999;float: right;margin-top: 3px;cursor: pointer;}
.newEmailTop .topR input{vertical-align: -2px;margin-right: 3px;}
.newEmailTop .topR .hiddenBox{position: absolute;background: #fff;border: 1px #dedede solid;padding: 10px;top: 0px;left: -200px;display: none;width: 240px;font-size: 12px;z-index: 999999;}
.newEmailTop .topR .hiddenBox ul li{float: inherit !important; }
.newEmailTop .topR .hiddenBox:after{content: "\e623";font-family: layui-icon;position: absolute;right: -10px;color: #dedede;top: 0px;}
.mailBox  .newNav *{box-sizing: border-box;}
.mailBox  .newNav{width: 160px;display: inline-block;overflow: hidden;background: #f3f3f3;position: fixed;height: 100%;}
.mailBox  .newNav ul{margin: 0;}

.mailBox  .newNav ul li{width: 100%;}
.mailBox  .newNav ul li.active a{background: #ddd;}
.mailBox  .newNav ul li a{padding: 0 10px;width: 160px;border-top: 1px #dedede dotted;border-radius: 0;}
.mailBox  .newNav ul li a span{color: #009688;}
.mailBox  .newNav ul li a cite{margin-left: -4px;}
.mailBox  .newNav ul li a i{font-size: 20px;color: #666;vertical-align: -2px;}
.newNav a.flexible1{display: inline-block;padding:10px;width: 100%;}
.newNav a.flexible1 i{margin-left: 5px;    float: left;}
.newNav a.flexible1 span{float: right;}
.mailBox .mainRight{width: calc(100% - 170px);padding-left: 15px;padding-left: 170px;}
.mailBox .mainRight .my-layui.btn-add{margin: 10px 0;}
.mailBox.change .newNav{width: 40px;overflow: hidden;}
.mailBox.change .newNav .flexible1 span{display: none;}
.mailBox.change .mainRight{width: calc(100% - 60px);padding-left: 60px;}
.newMailList .list{padding: 10px 0;border-bottom: 1px #dedede solid;}
.newMailList .list .readState{float: left;margin-top: 4px;}
.newMailList .list .readState i{font-size:16px;}
.newMailList .list .readState1 i{color: #ff5722;}
.newMailList .list .readState2 i{color: #ccc;}
.newMailList .list dl{display: inline-block;width: calc(100% - 390px);padding-left: 10px;}
.newMailList .list dl dt{float: left;width: 25px;margin-top: 4px;}
.newMailList .list dl dt i{font-size: 16px;}
 i.male{color: #c5e6ff;}
 i.female{color: #ffe2ee;}
.newMailList .list dl dd{color: #666;float: left;width: 100%;    width: calc(100% - 60px);}
.newMailList .list dl dd .mailTit{display: inherit;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 100%;}
.dealt{margin-left: 10px;vertical-align: -2px; color: #999;}
.newMailList .list dl dd .dealtDetial{margin-left: 10px;}
.newMailList .list dl dd .dealtDetial a{margin-left: 5px;}
.newMailList .list dl dd .dealtDetial time{color: #999;font-size: 13px;}
.dealt.click{color: #ffcb56;}
.newMailList .list .right{float: right;color: #999;text-align: right;}
.newMailList .list .right .layui-badge{position: absolute;right: 15px;margin-top: 10px;}
.newMailList .list .right i{margin-right: 10px;cursor: pointer;}
.star{color: #999;}
.star.active{color: #ffcb56 !important;}
.newMailList .list .right p.state{font-size: 13px;text-align: right;float: right;margin-left: 10px;margin-top: 2px;}
.newMailList .list .right p.state a{margin-left: 10px;}
.newMailList .list .right p.state1{color: #f00;}
.newMailList .list .right p.state2{color: #00ca19;}
.newMailList .list .right p.state3{color: #00BCD4;}
.newMailList .list .right p.state4{color: #bb9a4e;}
.newMailList .list input[type="checkbox"]{float: left;vertical-align: top;}
.newMailList .list .layui-form-checkbox[lay-skin=primary]{float: left;margin-top: 5px;}
.mailBox {min-height: 500px;}
.detailMain .list{border-bottom: 1px #dedede solid;padding-bottom: 10px;}
.detailMain .list dl{color: 666;display: inline-block;}
.detailMain .list dl dd{color: #666;}
.detailMain .list dl dd a{margin-left: 5px;}
.detailMain .list dl p em{margin-left: 10px;}
.detailMain .list dl p em.buyer{color: #009688;}
.detailMain .list dl p em.seller{color: #f00;}
.detailMain .list .right{float: right;color: #999;}
.detailMain .list .right p{text-align: right;}
.detailMain .list .right i{margin-right: 10px;}
.detailMain .list .right a{margin-right: 10px;}
.detailMain {padding-bottom: 50px;/* height: 100vh; */}
.detailMain .detailBtm{position: fixed;width: 100%;bottom: 0;height: 40px;box-shadow: 0 0 3px #ddd;left: 0;padding: 0 10px;background: #fff;}
.detailMain .detailBtm i{font-size: 20px;color: #666;line-height: 40px;cursor: pointer;}
.detailMain .detailBtm button{line-height: 40px;float: right;    margin-right: 10px;}
.addsLi .list p{display: inline-block;color: #666;}
.addsLi .list p i{margin-right: 5px;vertical-align: -6px;font-size: 18px;}
.mainRight .country{margin-right: 10px;}
.addsLi .list input[type='checkbox']{float: left;}
.addsLi .list em{float: right;font-size: 13px;color: #999;}
.addsLi .list em.buyer{color: #009688;}
.addsLi .list em.seller{color: #f00;}
.addsLi .list{padding: 10px 0;border-bottom: 1px #dedede solid;cursor: pointer;}
.detailMain .list .mainBox{display: inline-block;}
.detailMain .list .top{margin-bottom: 10px;}
.detailMain .list .mainBox li{line-height: 22px;}
.ContactsFile  dl{background: #efefef;padding: 10px;float: left;margin: 10px;margin-left: 0;}
.ContactsFile  dl a{display: flex;align-items: center;}
.ContactsFile  dl dt{float: left;margin-right: 10px;width: 40px;}
.ContactsFile  dl dt img{width: 40px;}
.ContactsFile  dl dd{float: left;}
.detailMain .title{font-size: 14px;font-weight: bold;margin-top: 10px;padding-bottom: 5px;border-bottom: 1px #dedede solid;}
.detailMain .title a{float: right;font-weight: normal;}
.contactEmail ul li span{float: right;    color: #999;}
.contactEmail ul li span i{margin: 0 5px;}
.contactEmail ul li{padding: 5px 0;border-bottom: 1px #dedede solid;}
.contactEmail ul li a{width: 100%;display: inline-block;}
.contactEmail ul li em{color: #08c;}
.contactEmail ul li em.fa{color: #f00;}
.contactEmail ul li cite{width: calc(100% - 310px);overflow: hidden;white-space: nowrap;text-overflow: ellipsis;display: inherit;vertical-align: -6px;}
#dealt{padding: 10px 0;}
#dealt input[type="text"]{width: 360px;}
#dealt textarea{width: 360px;}
#dealt .layui-inline{margin-top: 10px;}
.detailMain .toDealt{padding: 10px;background: #fff7eb;margin-bottom: 10px;}
.detailMain .toDealt p{color: #666;}
.detailMain .toDealt p a{float: right;margin-right: 5px;}
.detailMain .toDealt p i{margin-right: 5px;}
.detailMain .toDealt .remarks{padding-top:5px;border-top: 1px #dedede solid;margin-top: 5px;}
.emailState{font-size: 13px;}
.emailState.state1{color: #f00;}
.emailState.state2{color: #00ca19;}
.emailState.state3{color: #00BCD4;}
.emailState.state4{color: #bb9a4e;}
.emailState a{margin-left: 5px;}
#viewRemarks{padding: 20px;}
.detailMain .mailTxt{margin: 10px 0;}
.detailMain .emailTit{font-size: 14px;font-weight: bold;margin-top: 15px;}